<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>API响应测试</title>
</head>
<body>
    <h1>API响应测试</h1>
    <button onclick="testApi()">测试API响应</button>
    <div id="result"></div>

    <script>
        async function testApi() {
            try {
                const response = await fetch('https://tqi.techlinkpets3d.com/api/daka/person_rank');
                const text = await response.text();
                document.getElementById('result').innerHTML = `
                    <h2>响应状态: ${response.status}</h2>
                    <h2>响应头:</h2>
                    <pre>${JSON.stringify(Object.fromEntries(response.headers.entries()), null, 2)}</pre>
                    <h2>响应内容:</h2>
                    <pre>${text}</pre>
                    <h2>尝试解析JSON:</h2>
                `;
                
                try {
                    const json = JSON.parse(text);
                    document.getElementById('result').innerHTML += `<pre>${JSON.stringify(json, null, 2)}</pre>`;
                } catch (parseError) {
                    document.getElementById('result').innerHTML += `<p style="color:red;">JSON解析失败: ${parseError.message}</p>`;
                }
            } catch (error) {
                document.getElementById('result').innerHTML = `<p style="color:red;">请求失败: ${error.message}</p>`;
            }
        }
    </script>
</body>
</html>